<html>

<head>

	<script src='editor.js' language="JavaScript" type="text/javascript"></script>
	<link rel="stylesheet" type="text/css" href="/css/css.css"></link>

</head>
<body onload="JavaScriptEditor.init()">
<h1>Homemade Javascript Editor, Interpreter, whatever. </h1>
<h2>Description</h2>
<p>Provides an easy-to-use Javascript editor and execution environment
that's trivial to attach to an existing html page. It's useful for
presentations, debugging, testing or just executing snippets of
javascript code to try them out.</p>

<h2>Usage</h2>
<p>Type code into the first of the three textareas below and hit
the execute button. (Or press Ctrl-Enter if you're using Firefox).
Output of your script is written to the window below it and errors and
caught exceptions are printed to the third window. The editor defines
the functions `print` and `printf` which you can use output text to the output
textarea. As an added utility, you may enter tabs into the textarea,
though I've not been able to get this feature to work fully, and not at
all under IE.</p>

<h2>Predefined functions</h2>
<ul>
<li><strong>print(arg) </strong> print the argument followed by a newline.</li>
<li><strong>printf(arg, ... )</strong> rudimentary formatted printing, supports
"%s", "%d", "%x", "%o", "%b". Also appends a newline to the printed text.</li>
<li><strong>dumpProperties(obj)</strong> dumps all the properties of the
argument, basically does <code>for (var prop in obj){print(prop+":"+obj[prop])}</code>.</li>
<li><strong>load(file_uri) </strong> load and execute a javascript
source file from the server.</li>
</ul>


<h2>Examples</h2>
<p>Try some of these examples:</p>
<pre>
	var i = 26
	alert(i)
	printf ("Decimal: %d Octal: %o Hex: %x Binary: %b ", i, i, i, i)
	
	dumpProperties(document.forms)

	load("test.js")
</pre>
<p>or this <a href="http://en.wikipedia.org/wiki/Quine_%28computing%29">quine:</a></p>
<pre>
	print(document.getElementById("__input").value)
</pre>

<div id="javascript_editor"></div>

<h2>Including the Editor on a Page of Your Own.</h2>

<ol>
<li>Grab this <a href="editor.js">file</a>.</li>
<li>link to it on the page where you want the editor to appear like
this: <pre>
	&lt;script src='editor.js' language="JavaScript" type="text/javascript"&gt;&lt;/script&gt;
</pre>
</li>
<li>provide a div with the ID set to "javascript_editor" where you'd
like the editor to appear like this:
<pre>
	&lt;div id="javascript_editor"&gt;&lt;/div&gt;
</pre>
</li>

<li>call <code>JavaScriptEditor.init()</code>, initialization needs to
be done after the page is loaded, so a good place to do this would be
the <code>onload</code> handler of the html-body tag.</li>

</ol>

<h2>Attaching the Editor to Other People's Pages.</h2>
<p>
It's also possible to attach the editor to
arbitrary pages. Bookmark <a href="javascript:(function(){ window.autoinit=true; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = 'http://www.kuriositaet.de/javascript/js_editor/editor.js'; document.getElementsByTagName('head')[0].appendChild(script); })()">this link</a>. Using the bookmark allows you to
attach an editor to the page you're currently viewing. <strong>This feature
is experimental.</strong> I.e. it doesn't work reliably. That said, the
bookmarklet usually works very well, but don't
expect it to work on really AJAXY, CSS-tableless pages. The problem
seems to be finding the proper place in the DOM to attach the editor to.
</p>


<h2>Known Bugs / Limitations</h2>
<ul>
<li>If you need to scroll in the editor textarea, tabbing will return
the cursor to the proper position, but the position of the viewport is
lost.</li>

<li>Ctrl-Enter and Tabbing don't work on IE. I'm not a webdeveloper and
don't use IE. It's probably an easy fix for someone who knows what
they're' doing and I'd appreciate it if you let me know how it's done.
I'd guess a bunch of other also doesn't work well on IE.</li>

</ul>

<h2>CREDITS</h2>

Special thanks to "Locutus of Borg" for help
with IE and scriptlet support.

<h2>LICENSE</h2>

This code is (c)2006 Tim Becker (tim.becker@kuriositaet.de) and provided
with absolutely no gurantees. Feel free to do whatever you please with it,
though I'd appreciate it if you give me some credit, provide feeback,
bugfixes, ideas ...




</body>
</html>
